<template>
    <div id="profit">
        <el-form :inline="true" size="medium">
			<el-form-item>
				<el-select
                    clearable
                    v-model="params.tenantId" 
                    placeholder="选择租户" 
                    @change="search">
					<el-option
                        v-for="item in tenantList"
                        :key="item.id"
                        :label="item.company"
                        :value="item.id">
					</el-option>
				</el-select>
			</el-form-item>
			<el-form-item>
				<el-select v-model="params.dealType"  @change="search" clearable>
					<el-option value="1" label="订单完成"></el-option>
					<el-option value="2" label="商家升级会员"></el-option>
					<el-option value="100" label="其他"></el-option>
				</el-select>
			</el-form-item>
            <el-form-item>
                <el-input v-model="params.remark" placeholder="备注"/>
            </el-form-item>
			<el-form-item>
				<el-button type="primary" @click="search">搜索</el-button>
			</el-form-item>
		</el-form>

		<el-table :data="list" v-loading="loading" stripe>
			<el-table-column 
				label="分站"
				align="center">
				<template slot-scope="scope">
					<span v-for="item in tenantList" v-if="item.id == scope.row.tenant_id">{{item.company}}</span>
				</template>
			</el-table-column>
            <el-table-column label="收益类型" prop="deal_type" align="center">
                <template slot-scope="scope" >
					<span v-if="scope.row.deal_type === 1">订单完成</span>
					<span v-if="scope.row.deal_type === 2">商家升级会员</span>
                    <span v-if="scope.row.deal_type === 100">其他</span>
				</template>
            </el-table-column>
            <el-table-column label="金额" prop="money"></el-table-column>
            <el-table-column label="收益来源" prop="origin"></el-table-column>
            <el-table-column label="备注" prop="remark"></el-table-column>
            <el-table-column label="创建时间">
                <template slot-scope="scope">
                    {{$common.getDate(scope.row.create_time)}}
                </template>
            </el-table-column>
		</el-table>

		<el-pagination 
			class="page"
			background
			@size-change="handleSizeChange"
			@current-change="getList" 
			:current-page.sync="params.pageNo" 
			:page-sizes="[10, 20, 50, 100]" 
			:page-size="params.pageSize" 
			layout="total, sizes, prev, pager, next, jumper" 
			:total="total">
		</el-pagination>
    </div>
</template>

<script>
export default {
    name: '',
    data() {
        return {
            list: [],
            timeArr:[],
            params: {
                pageNo: 1,
                pageSize: 10,
                dealType: '',
                tenantId: '',
                remark: '',
                startTime: '',
                endTime: '',
                isCount: true
            },
            tenantList: [],
            loading: false,
            total: 100,
        }
    },
    created(){
        this.getList()
        this.getTenantList()
    },
    mounted(){},
    watch: {},
    methods: {
        timeChange(val){
            if(val){
                this.params.startTime = this.$common.getDate(val[0]);
                this.params.endTime = this.$common.getDate(val[1]);
            }else{
                this.params.startTime = ''
                this.params.endTime = ''
            }
        },
        getList(){
            this.$request.post({
                url: '/ReportApi/admin/profitList',
                params: this.params,
                success: res => {
                    this.list = res[0]
                    if(this.params.isCount){
                        this.params.isCount = false 
                        this.total = [1]
                    }
                }
            })
        },
        handleSizeChange(value) {
            this.params.pageSize = value 
            this.search()
        },

        search(){
            this.params.pageNo = 1
            this.params.isCount = true 
            this.getList();
        },
        getTenantList(){
            this.$request.post({
                url: '/ReportApi/admin/tenantlist',
                success: res => {
                    this.tenantList = res
                }
            })
        },
    }
}
</script>

<style lang="scss" scoped>
#profit{
    .page{
		text-align: right;
		margin-top: 20px;
	}
}
</style>